import React ,{ Component } from "react";
import PropTypes from 'prop-types';

class TodoItem extends Component {

  constructor(props){
    super(props);
    this.handleClick = this.handleClick.bind(this)
  }

  render(){
    console.log('c-render')
    const { content} = this.props
    return <div onClick={ this.handleClick }>{content}</div>
  }

  componentWillUnmount(){
  }

  componentWillReceiveProps(){
  }

  shouldComponentUpdate(nextProps,nextState){
    if(nextProps.content !== this.props.content){
      return true
    }else{
      return false
    }
  }
  

  handleClick(){
    const { deleteTodoItemBtn,index } = this.props;
    deleteTodoItemBtn(index)
  }
}

TodoItem.propTypes = {
  test: PropTypes.string.isRequired,
  content: PropTypes.oneOfType([PropTypes.number,PropTypes.string]),
  deleteTodoItemBtn: PropTypes.func,
  index: PropTypes.number
}

TodoItem.defaultProps = {
  test:""
}

export default TodoItem;